<template>
	<div id="WechatDiv">
	<router-view></router-view>
		<!-- <h1>{{msg}}</h1> -->
		<div id="Login">
			<p id="Login_p" @click="jump('login')"><span >登录</span>/<span>注册</span></p>
			<ul id="Login_ul">
				<li style="border-right: 1px solid white;box-sizing: border-box;">
					<dl @click="jump('login')">
						<dt ><span class="mui-icon mui-icon-star" style="float: left;margin-top: 20px;margin-left:40px"></span></dt>
						<dd>我的钱包</dd>
					</dl>

				</li>
				<li>
					<dl @click="jump('login')">
						<dt><span class="mui-icon mui-icon-pengyouquan" style="float: left;margin-top: 20px;margin-left:40px"></span></dt>
						<dd>会员卡</dd>
					</dl>
				</li>
			</ul>
		</div>
		<div id="second">
			<div id="second_small">
				<dl @click="jump('login')">
					<dt><span class="mui-icon mui-icon-bars"></span></dt>
					<dd>全部订单</dd>
				</dl>
			</div>
			<div id="second_small">
				<dl @click="jump('login')">
					<dt><span class="mui-icon mui-icon-location
 
"></span></dt>
					<dd>收货地址</dd>
				</dl>
			</div>
			<div id="second_small">
				<dl @click="jump('login')">
					<dt><span class="mui-icon mui-icon-locked"></span></dt>
					<dd>账户安全</dd>
				</dl>
			</div>
			<div id="second_small">
				<dl>
					<dt><span class="mui-icon mui-icon-person">
						
					</span></dt>
					<dd>客服中心</dd>
				</dl>
			</div>
			<div id="second_small" @click="jump1('about')">
				
				<dl>
					<dt><span class="mui-icon mui-icon-paperplane"></span></dt>
					<dd>关于我们</dd>
				</dl>
			</div>
			<div id="second_small"	@click="jump2('set')" >
				<dl>
					<dt><span class="mui-icon mui-icon-gear">
						
					</span></dt>
					<dd>设置中心</dd>
				</dl>
			</div>
		</div>
	</div>    



</template>

<script>
export default {
  name: 'Me',
  data () {
    return {
      msg: '我的'
    }
  },
  methods:{
		  	jump:function () {
						this.$router.push({path:'/login'})
						$("#list").hide();
					},
			jump1:function () {
						this.$router.push({path:'/about'})
						$("#list").hide();
					},
			jump2:function () {
				this.$router.push({path:'/set'})
				$("#list").hide();
			}


}

  
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

	.WechartDiv{
		width: 100%;
		height: 100%;
		}
		#Login{
			width: 100%;
			/*height: 20rem;*/
			background-color: red;
			overflow: hidden;
			text-align: center;
		}
		#Login_p{
			width: 60%;margin-left: 20%;border:0.3rem solid white;line-height: 3rem;
			margin-top: 8rem;
		/*	float: left;*/
			border-radius: .5rem;
			font-size: 1.6rem;color: white;
			text-align: center;

		}
		#Login_p span{
			color: white;
			font-size: 2rem;
		}
		#Login_ul{
			display: flex;
			justify-content: space-around;
			width: 95%;margin-top: 8rem;
			margin-left:2.5%;
			/*margin-bottom: 3rem;*/
			border-top: 1px solid white;
			line-height: 4rem;
		}
		#Login_ul li{
			width: 50%;
			margin-bottom: 0px;
			color: white;
			font-size: 1.4rem;
			text-align: center;
			}
			#Login_ul dd{
				float: left;
				margin-left: 2rem;
				margin-top: 1rem;
			}
		#second{
			width: 100%;
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap; 

		}
		#second_small{
			width: 33.3%;
			border:0.1rem solid #ccc;
			box-sizing: border-box;
		}
		#second_small dd{
			font-size: 1.2rem;
			color: #888888;
			text-align: center;
			margin-bottom: 3rem;
		}
		#second_small dt{
			text-align: center;
			margin-top: 1rem;
		}
		.mui-icon{
			transform: scale(2);
			margin-top: 50px;
			margin-bottom: 20px;
			/*display: block;*/
		}




			
		
	
</style>
